<!-- <section class="content container-fluid"> -->
<div class="card-header">
  <div class="row">
    <div class="col-md-12">
      <filter-list
        request="request"
        callback="getList(pageIndex)"
      ></filter-list>
    </div>

    <div class="col-md-12">
      <div
        class="btn-toolbar mb-3"
        role="toolbar"
        aria-label="Toolbar with button groups"
      >
        <div class="btn-group me-2">
          <a
            href="/portal/post/create-gallery?module_ids={{moduleId}}"
            class="btn btn-link"
          >
            <i class="fas fa-plus"></i>
          </a>
          <a
            data-bs-toggle="modal"
            data-bs-target="#modal-nav-posts-{{moduleId}}"
            class="btn btn-link"
          >
            <i class="fas fa-search"></i>
          </a>
          <a href="/portal/module/details/{{moduleId}}" class="btn btn-link">
            <i class="fas fa-pen"></i>
          </a>
        </div>
      </div>
    </div>
    <modal-nav-posts
      save="saveOthers()"
      src-column="'moduleId'"
      src-id="moduleId"
      selected="others"
      query="'not_module_id='"
    ></modal-nav-posts>
  </div>
</div>
<div class="card-body">
  <table
    id="list-page"
    class="table table-sm table-hover sortable"
    cellspacing="0"
    ng-init="getList()"
  >
    <thead class="thead-light">
      <tr>
        <th scope="col" style="width: 3%">
          <small
            class="fa fa-grip-vertical fa-xs text-black-50 align-middle"
          ></small>
        </th>
        <th scope="col" style="width: 4%">
          <span
            class="fa fa-grip-vertical fa-xs text-black-50-numeric-down"
          ></span>
        </th>
        <th scope="col" style="width: 25%">Title</th>
        <th scope="col" width="10%">Image</th>
        <th scope="col" width="10%">Created Date</th>
        <th scope="col" style="width: 10%">Author</th>

        <th scope="col" style="width: 5%"></th>
      </tr>
    </thead>

    <tbody class="sortable" dnd-list="data.items" dnd-disable-if="canDrag">
      <tr ng-if="canDrag">
        <td colspan="7">
          <small
            class="text-info"
            ng-bind="translate('warning_can_not_drag_drop',true, '(Drag & Drop feature only active when priority is asc)')"
          ></small>
        </td>
      </tr>
      <tr
        ng-repeat="item in data.items"
        dnd-draggable="item"
        dnd-effect-allowed="move"
        dnd-selected="selected = item"
        dnd-moved="updateInfos($index)"
        ng-class="{'selected': selected === item}"
      >
        <td style="cursor: grab" class="drag-header">
          <small
            class="fa fa-grip-vertical fa-xs text-black-50 align-middle"
          ></small>
        </td>
        <td>
          <input
            type="text"
            value="{{item.priority}}"
            class="item-priority form-control form-control-sm d-inline"
            style="width: 40px"
          />
        </td>
        <td>
          <small>
            <span ng-bind-html="item.post.title"></span>
          </small>
        </td>
        <td>
          <div ng-if="item.post.image!=''">
            <preview-image
              img-height="50"
              img-src="item.post.imageUrl"
            ></preview-image>
          </div>
        </td>
        <td>
          <small>
            {{item.post.createdDateTime | utcToLocal:'dd.MM.yy hh:mm a'}}
          </small>
        </td>
        <td>{{item.post.createdBy}}</td>

        <td>
          <div
            class="btn-group btn-group-sm btn-group-sm float-end"
            role="group"
            aria-label="Actions"
          >
            <a
              href="/portal/post/gallery-details/{{item.post.id}}"
              class="btn btn-link"
            >
              <span class="fas fa-pen text-primary"></span>
            </a>
            <a
              href="{{item.post.detailsUrl}}"
              target="_blank"
              class="btn btn-link"
            >
              <span class="fas fa-eye text-info"></span>
            </a>

            <a
              ng-click="remove(item.moduleId,item.postId);"
              class="btn btn-link"
            >
              <span class="fas fa-trash-alt text-danger"></span>
            </a>
          </div>
        </td>
      </tr>
    </tbody>
  </table>
</div>
<div class="card-footer">
  <paging
    class="small"
    page="data.page"
    page-size="data.pageSize"
    total="data.totalItems"
    ul-class="pagination justify-content-end m-0"
    a-class="page-link"
    paging-action="getList(page-1)"
    scroll-top="true"
  ></paging>
</div>

<!-- </section> -->
